<template>
  <div class="news">
    <div class="list" @click="router({path: '/news'})">
      <img src="@/assets/zhihuibao16.png" alt="">
      <div class="con">
        <p class="title">90%的家长正在经历的事情，日夜困惑煎熬</p>
        <p class="read"><img src="@/assets/zhihuibao17.png" alt=""> 136</p>
      </div>
    </div>
    <div class="list" @click="router({path: '/news'})">
      <img src="@/assets/zhihuibao16.png" alt="">
      <div class="con">
        <p class="title">90%的家长正在经历的事情，日夜困惑煎熬</p>
        <p class="read"><img src="@/assets/zhihuibao17.png" alt=""> 136</p>
      </div>
    </div>
  </div>
</template>

<script>

  export default {
    components: {
    },
    data () {
      return {
      }
    },
    created () {
    },
    methods: {
      router (path) {
        this.$router.push(path)
      },
    }
  }
</script>

<style lang="stylus" scoped>  
.news
  padding 0 1.5rem
  .list
    border-bottom 1px solid #e6e6e6
    display flex
    padding-bottom 2rem
    padding-top 2rem
    &:first-child
      padding-top 0
    img
      width 11.4rem
      height 8.5rem
      max-width 11.4rem
      margin-right 1.5rem
    .con
      flex 1
      .title
        font-size 1.3rem
        font-weight bold
        line-height 2.3rem
        color #212121
        margin-bottom 1.8rem
        overflow hidden
        text-overflow ellipsis
        display -webkit-box
        -webkit-line-clamp 2
        -webkit-box-orient vertical
      .read
        padding-left 2rem
        position relative
        height 1.2rem
        line-height 1.2rem
        font-size 1.2rem
        img
          position absolute
          width 1.35rem
          height .95rem
          left 0
          top .15rem

</style>
